<template>
    <div class="teamplate-drugdata">
        <div class="container-fluid">
            <div class="row h-query">
                <form class="form-inline">
                    <div class="form-group">
                        <label class="">开始日期：</label>
                        <input type="text" class="form-control start-date" id="j_startDate">
                    </div>
                    <div class="form-group">
                        <label class="">结束日期：</label>
                        <input type="text" class="form-control end-date" id="j_endDate">
                    </div>
                    <div class="form-group">
                        <button type="button" class="btn btn-default" @click="onInquiry">查询</button>
                    </div>
                    <div class="form-group">
                        <label class="">定位到</label>
                        <div class="input-group">
                            <input type="number" class="form-control" style="width:80px" v-model="rowsNum">
                            <div class="input-group-addon">行</div>
                        </div>
                        <!-- <button type="button" class="btn btn-default" @click="onJump">跳转</button> -->
                    </div>
                    <div class="btn-group pull-right">
                        <button  type="bottom"  class="btn btn-default"  @click="onExport"> 一键导出</button>
                    </div>
                </form>
            </div>
            <div class="row">
                <div class="list-table">
                    <div class="list-h item-hd">
                        <div class="btn-group">
                            <button class="btn" @click="onTab(0)">购进记录</button>
                            <button class="btn" @click="onTab(1)">销售记录</button>
                            <button class="btn" @click="onTab(2)">库存记录</button>
                            <button class="btn" @click="onTab(3)">温湿记录</button>
                            <button class="btn" @click="onTab(4)">召回记录</button>
                            <button class="btn" @click="onTab(5)">药师信息记录</button>
                            <button class="btn" @click="onTab(6)">药师在岗记录</button>
                        </div>
                    </div>
                    <div class="item-bd">
                        <div class="item" v-show="item==0">
                            <div class="table-wrap" style="min-height:500px;">
                                <table class="table table-striped" width="100%">
                                    <thead>
                                        <tr>
                                            <th class="tl">供应商名称</th>
                                            <th class="tl">供应商许可证号</th>
                                            <th class="tl">供应商企业类型</th>
                                            <th class="tl">供应商企业地址</th>
                                            <th class="tl">供应商行政区划ID</th>
                                            <th class="tl">批准文号</th>
                                            <th class="tl">药品通用号</th>
                                            <th class="tl">购进日期</th>
                                            <th class="tr">购进数量</th>
                                            <th class="tl">批号</th>
                                            <th class="tl">计量单位</th>
                                            <th class="tl">包装规格</th>
                                        </tr>
                                    </thead>
                                    <tbody >
                                        <tr v-for="(item,index) in lists.list1" v-show="lists.list1.length>0" :class="index+1==rowsNum?'rows-num':''">
                                            <td>{{item.s_ent_name}}</td>
                                            <td>{{item.s_licence_no}}</td>
                                            <td></td>
                                            <td>{{item.s_ent_address}}</td>
                                            <td></td>
                                            <td>{{item.pass_num}}</td>
                                            <td>{{item.drug_name}}</td>
                                            <td>{{item.buy_date}}</td>
                                            <td class="tr">{{(item.buy_amount).toFixed(3)}}</td>
                                            <td>{{item.lot_num}}</td>
                                            <td>{{item.uom}}</td>
                                            <td>{{item.pack_spec}}</td>
                                        </tr>
                                        <tr v-show="lists.list1.length<=0">
                                            <td class="tc red" colspan="12">未查找到相关数据</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="item" v-show="item==1">
                            <div class="table-wrap" style="min-height:500px;">
                                <table class="table table-striped" width="100%">
                                    <tbody>
                                        <tr>
                                            <th class="tl">批准文号</th>
                                            <th class="tl">药品通用名</th>
                                            <th class="tl">销售日期</th>
                                            <th class="tr">销售数量</th>
                                            <th class="tl">批号</th>
                                            <th class="tl">计量单位</th>
                                            <th class="tl">包装规格</th>
                                        </tr>
                                        <tr v-for="(item,index) in lists.list2" v-show="lists.list2.length>0" :class="index+1==rowsNum?'rows-num':''">
                                            <td>{{item.pass_num}}</td>
                                            <td>{{item.drug_name}}</td>
                                            <td>{{item.sale_date}}</td>
                                            <td class="tr">{{(item.sale_amount).toFixed(3)}}</td>
                                            <td>{{item.lot_num}}</td>
                                            <td>{{item.uom}}</td>
                                            <td>{{item.pack_spec}}</td>
                                        </tr>
                                        <tr v-show="lists.list2.length<=0">
                                            <td class="tc red" colspan="7">未查找到相关数据</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="item" v-show="item==2">
                            <div class="table-wrap" style="min-height:500px;">
                                <table class="table table-striped" width="100%">
                                    <thead>
                                        <tr>
                                            <th class="tl">批准文号</th>
                                            <th class="tl">药品通用名</th>
                                            <th class="tl">批号</th>
                                            <th class="tl">计量单位</th>
                                            <th class="tl">包装规格</th>
                                            <th class="tr">库存数量</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr v-for="(item,index) in lists.list3" v-show="lists.list3.length>0" :class="index+1==rowsNum?'rows-num':''">
                                            <td>{{item.pass_num}}</td>
                                            <td>{{item.drug_name}}</td>
                                            <td>{{item.lot_num}}</td>
                                            <td>{{item.uom}}</td>
                                            <td>{{item.pack_spec}}</td>
                                            <td class="tr">{{(item.stock_amount).toFixed(3)}}</td>
                                        </tr>
                                        <tr v-show="lists.list3.length<=0">
                                            <td class="tc red" colspan="7">未查找到相关数据</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="item" v-show="item==3">
                            <div class="table-wrap" style="min-height:500px;">
                                <table class="table table-striped" width="100%">
                                    <thead>
                                        <tr>
                                            <th class="tl">监控区域</th>
                                            <th class="tl">采样时间</th>
                                            <th class="tr">温度</th>
                                            <th class="tr">湿度</th>
                                            <th class="tl">责任人姓名</th>
                                            <th class="tl">处理措施</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr v-for="(item,index) in lists.list4" v-show="lists.list4.length>0" :class="index+1==rowsNum?'rows-num':''">
                                            <td>{{item.area}}</td>
                                            <td>{{item.upload_date|date}}</td>
                                            <td class="tr">{{item.temperature}}</td>
                                            <td class="tr">{{item.humidity}}</td>
                                            <td class="tl">{{item.operator_name}}</td>
                                            <td class="tl">{{item.yishj}}</td>
                                        </tr>
                                        <tr v-show="lists.list4.length<=0">
                                            <td class="tc red" colspan="7">未查找到相关数据</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="item" v-show="item==4">
                            <div class="table-wrap" style="min-height:500px;">
                                <table class="table table-striped" width="100%">
                                    <thead>
                                        <tr>
                                            <th style="text-align:left">批准文号</th>
                                            <th style="text-align:left">药品通用名</th>
                                            <th style="text-align:left">批号</th>
                                            <th style="text-align:left">计量单位</th>
                                            <th style="text-align:left">包装规格</th>
                                            <th style="text-align:left">召回企业名称</th>
                                            <th style="text-align:left">召回数量</th>
                                            <th style="text-align:left">召回日期</th>
                                            <th style="text-align:left">召回原因</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr v-for="(item,index) in lists.list5" v-show="lists.list5.length>0" :class="index+1==rowsNum?'rows-num':''">
                                            <td>{{item.pass_num}}</td>
                                            <td>{{item.drug_name}}</td>
                                            <td>{{item.lot_num}}</td>
                                            <td>{{item.uom}}</td>
                                            <td>{{item.pack_spec}}</td>
                                            <td>{{}}</td>
                                            <td>{{}}</td>
                                            <td>{{}}</td>
                                            <td>{{}}</td>
                                        </tr>
                                        <tr v-show="lists.list5.length<=0">
                                            <td class="tc red" colspan="7">未查找到相关数据</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="item" v-show="item==5">
                            <div class="table-wrap" style="min-height:500px;">
                                <table class="table table-striped" width="100%">
                                    <thead>
                                        <tr>
                                            <th class="tl">药师姓名</th>
                                            <th class="tl">药师身份证号</th>
                                            <th class="tl">职业资格</th>
                                            <th class="tl">是否挂牌</th>
                                            <th class="tl">有效期</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr v-for="(item,index) in lists.list6" v-show="lists.list6.length>0" :class="index+1==rowsNum?'rows-num':''">
                                            <td>{{item.dzyname}}</td>
                                            <td>{{item.idcard}}</td>
                                            <td>{{item.zyzc}}</td>
                                            <td>{{item.is_gp}}</td>
                                            <td>{{item.avail_date|date}}</td>
                                        </tr>
                                        <tr v-show="lists.list6.length<=0">
                                            <td class="tc red" colspan="7">未查找到相关数据</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="item" v-show="item==6">
                                <div class="table-wrap" style="min-height:500px;">
                                    <table class="table table-striped" width="100%">
                                        <thead>
                                            <tr>
                                                <th class="tl">药师姓名</th>
                                                <th class="tl">药师身份证号</th>
                                                <th class="tl">在岗服务时间</th>
                                                <th class="tl">在岗服务类型</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr v-for="(item,index) in lists.list7" v-show="lists.list6.length>0" :class="index+1==rowsNum?'rows-num':''">
                                                <td>{{item.person_name}}</td>
                                                <td>{{item.person_id_number}}</td>
                                                <td>{{item.upload_date|date}}</td>
                                                <td>{{item.check_type}}</td>
                                            </tr>
                                            <tr v-show="lists.list6.length<=0">
                                                <td class="tc red" colspan="7">未查找到相关数据</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    import bus from "../api/eventBus";
    import {
        setUi,
        setpopPerfect
    } from "../vuex/actions";
    import {
        ui,
        popPerfect
    } from "../vuex/getters";
    export default {
        components: {},
        data() {
            return {
                rowsNum: "",
                item: 0,
                fdbs: "",
                lists: {
                    list1: {},
                    list2: {},
                    list3: {},
                    list4: {},
                    list5: {},
                    list6: {},
                    list7: {}
                }
            };
        },
        watch: {},
        vuex: {
            getters: {
                ui,
                popPerfect
            },
            actions: {
                setUi,
                setpopPerfect
            }
        },
        filters: {
            date: function(info) {
                function timetrans(date) {
                    var date = new Date(date); //如果date不为10位需要乘1000
                    var Y = date.getFullYear() + "-";
                    var M =
                        (date.getMonth() + 1 < 10 ?
                            "0" + (date.getMonth() + 1) :
                            date.getMonth() + 1) + "-";
                    var D =
                        (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) + " ";
                    var h =
                        (date.getHours() < 10 ? "0" + date.getHours() : date.getHours()) +
                        ":";
                    var m =
                        (date.getMinutes() < 10 ?
                            "0" + date.getMinutes() :
                            date.getMinutes()) + ":";
                    var s =
                        date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
                    return Y + M + D + h + m + s;
                }
                return timetrans(info);
            }
        },
        methods: {
            onTab(num) {
                //表格切换
                let me = this;
                me.item = num;
                me.onTableList();
            },
            onInquiry(e) {
                //查询
                let me = this;
                me.onTableList();
                me.rowsNum = "";
            },
            onTableList(e) {
                //表格数据
                let me = this;
                let res;
                if (me.item == 0) {
                    //购进记录
                    res = {
                        beginDate: $("#j_startDate").val(),
                        endDate: $("#j_endDate").val(),
                        fdbs: me.fdbs
                    };
                    me.service.selectBuysRecord(me, res, data => {
                        me.lists.list1 = data.data;
                    });
                }
                if (me.item == 1) {
                    //销售记录
                    res = {
                        beginDate: $("#j_startDate").val(),
                        endDate: $("#j_endDate").val(),
                        fdbs: me.fdbs
                    };
                    me.service.selectSalesRecord(me, res, data => {
                        me.lists.list2 = data.data;
                    });
                }
                if (me.item == 2) {
                    //库存记录
                    res = {
                        fdbs: me.fdbs
                    };
                    me.service.selectStocksRecord(me, res, data => {
                        me.lists.list3 = data.data;
                    });
                }
                if (me.item == 3) {
                    //温湿度记录
                    res = {
                        beginDate: $("#j_startDate").val(),
                        endDate: $("#j_endDate").val(),
                        fdbs: me.fdbs
                    };
                    me.service.selectHumitureRecordList(me, res, data => {
                        me.lists.list4 = data.data;
                    });
                }
                if (me.item == 4) {
                    //召回记录
                    res = {
                        beginDate: $("#j_startDate").val(),
                        endDate: $("#j_endDate").val(),
                        fdbs: me.fdbs
                    };
                    me.service.selectRecallRecord(me, res, data => {
                        me.lists.list5 = data.data;
                    });
                }
                if (me.item == 5) {
                    //药师信息
                    res = {
                        fdbs: me.fdbs
                    };
                    me.service.selectKQYaoShiList(me, data => {
                        me.lists.list6 = data.data;
                    });
                }
                if (me.item == 6) {
                    //药师在岗记录
                    res = {
                        beginDate: $("#j_startDate").val(),
                        endDate: $("#j_endDate").val(),
                        fdbs: me.fdbs,
                        personName: "",
                        personId: ""
                    };
                    me.service.selectYaoShiKQRecordList(me, res, data => {
                        me.lists.list7 = data.data;
                    });
                }
            },
            onJump(e) {
                //跳转
            },
            onExport(e) {
                let me = this;
                let res = {
                    beginDate: $('#j_startDate').val(),
                    endDate: $('#j_endDate').val(),
                    fdbs: me.fdbs
                }
                me.service.exportAllYaoJianRecord(me, res, data => {
                    layer.alert(data.message);
                });
            }
        },
        mounted() {
            let me = this;
            let user = JSON.parse(sessionStorage.getItem("user"));
            if (!user) {
                router.push({
                    path: "/login"
                });
                return;
            }
            me.fdbs = localStorage.getItem("fdbs");
            $(".start-date,.end-date").datetimepicker({
                language: "zh-CN",
                weekStart: 1,
                todayBtn: 1,
                autoclose: 1,
                todayHighlight: 1,
                startView: 2,
                minView: 2,
                forceParse: 0,
                format: "yyyy-mm-dd"
            });
            let time = new Date();
            let startTimes =
                time.getFullYear() + "-" + (time.getMonth() + 1) + "-" + "01"; //默认开始日期
            let endTimes =
                time.getFullYear() +
                "-" +
                (time.getMonth() + 1) +
                "-" +
                me.util.string.numFix(time.getDate()); //默认结束日期
            $("#j_startDate").val(startTimes);
            $("#j_endDate").val(endTimes);

            let res = {
                beginDate: startTimes,
                endDate: endTimes,
                fdbs: me.fdbs
            };
            me.service.selectBuysRecord(me, res, data => {
                me.lists.list1 = data.data;
            });
        }
    };
</script>